<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="UTF-8">
    <title>Home</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Raleway:wght@300&display=swap" rel="stylesheet"> 
    <script src="scripts/search.js"></script>
    <script src="scripts/load.js"></script>
  </head>

  <body>
    <div class="container">
      <div class="head">
        <div class="logo"><img src="icons/fox.svg" /></div>
        <div class="search_box">

          <img class="engine" id="engineLogo" src="icons/google.svg" onclick="toggleEngine()" style="cursor:pointer" />

          <div id="gSearch" style="display:block;">
            <form id="textField" class="google" action="https://google.com/search" method="get">
              <input class="input_box" type="text" name="q" placeholder="Search with Google">
              <button class="button"> <img src="icons/search.svg" style="cursor:pointer" /></button>
            </form>
          </div>

          <div id="dSearch" style="display:none;">
            <form class="duck" action="https://duckduckgo.com/" method="get">
              <input class="input_box" type="text" name="q" placeholder="Search with DuckDuckGo">
              <button class="button"> <img src="icons/search.svg" style="cursor:pointer" /></button>
            </form>
          </div>

        </div>
      </div>

      <div class="bookmark">
        <div class="category">
          <div class="icon" style="display: none;"><img src="icons/code.svg" /></div>
          <div class="bookmarks cod" style="display: none;">
            <li><a class="bm" href="https://www.hackerrank.com/dashboard">Hackerrank</a></li>
            <li><a class="bm" href="https://leetcode.com/problemset/algorithms/">LeetCode</a></li>
            <li><a class="bm" href="https://stackoverflow.com/">Stackoverflow</a></li>
            <li><a class="bm" href="https://www.coursera.org/in-progress">Coursera</a></li>
            <li><a class="bm" href="https://codeforces.com/">CodeForces</a></li>
          </div>
        </div>

        <div class="category">
          <div class="icon"><img src="icons/docs.svg" /></div>
          <div class="bookmarks doc">
            <li><a class="bm" href="https://en.cppreference.com/w/">C++</a></li>
            <li><a class="bm" href="https://docs.python.org/3.7/library/index.html">Python</a></li>
            <li><a class="bm" href="https://mail.google.com/mail/u/0/h/">Mail</a></li>
            <li><a class="bm" href="https://github.com/dbuxy218">Github</a></li>
            <li><a class="bm" href="https://mega.nz/">Mega</a></li>
          </div>
        </div>

        <div class="category">
          <div class="icon"><img src="icons/entertainment.svg" /></div>
          <div class="bookmarks ent">
            <li><a class="bm" href="https://www.reddit.com/r/unixporn/">r/Unixporn</a></li>
            <li><a class="bm" href="https://www.youtube.com/">Youtube</a></li>
            <li><a class="bm" href="https://twitter.com/home">Twitter</a></li>
            <li><a class="bm" href="https://www10.gogoanime.io/">Gogoanime</a></li>
            <li><a class="bm" href="https://kimcartoon.to/">Kimcartoon</a></li>
          </div>
        </div>

        <div class="category">
          <div class="icon"><img src="icons/music.svg" /></div>
          <div class="bookmarks mus">
            <li><a class="bm" href="https://open.spotify.com/">Spotify</a></li>
            <li><a class="bm" href="https://thelastdisaster.org/">LDisaster</a></li>
            <li><a class="bm" href="https://deathgrind.club/">Deathgrind</a></li>
            <li><a class="bm" href="https://coreradio.ru/">Core Radio</a></li>
            <li><a class="bm" href="https://blogmg23.blogspot.com/">Mg23</a></li>
          </div>
        </div>

        <div class="category">
          <div class="icon" style="display: none;"><img src="icons/art.svg" /></div>
          <div class="bookmarks art" style="display: none;">
            <li><a class="bm" href="https://www.behance.net/">Behance</a></li>
            <li><a class="bm" href="https://www.deviantart.com/">Deviantart</a></li>
            <li><a class="bm" href="https://www.tumblr.com/dashboard">Tumblr</a></li>
            <li><a class="bm" href="https://unsplash.com/">Unsplash</a></li>
            <li><a class="bm" href="https://in.pinterest.com/">Pinterest</a></li>
          </div>
        </div>

      </div>
    </div>
  </body>

</html>
